<template>
    <div class="app-container">
      <div
        class="header"
        style="display: flex; justify-content: space-between"
      >
        <el-form
          :model="queryParams"
          ref="queryRef"
          :inline="true"
          v-show="showSearch"
        >
          <!-- <el-form-item>
            <el-button
              icon="refresh"
              color=" rgb(69, 76, 105)"
              style="color: #fff"
              @click="resetQuery()"
            />
          </el-form-item> -->
          <!-- <el-form-item>
            <el-button
              @click="handleExport"
              color="rgb(146,226,206)"
              style="color: rgb(120, 120, 120); padding: 0 20px"
              v-hasPermi="['system:set:import']"
            >
              导 出
            </el-button>
          </el-form-item> -->
          <el-button
            @click="handleAdd"
            v-hasPermi="['system:car:add']"
            style="padding: 0 20px"
          >
            新 增
          </el-button>
        </el-form>
        <el-form
          :model="queryParams"
          ref="queryRef"
          :inline="true"
          v-show="showSearch"
          label-width="68px"
        >
          <!-- <el-form-item
            label=""
            prop="inviteId"
          >
            <el-input
              v-model="queryParams.inviteId"
              placeholder="请输入邀请人ID"
              clearable
              @keyup.enter="handleQuery"
            />
          </el-form-item>
          <el-form-item
            label=""
            prop="registerRole"
          >
            <el-select
              v-model="queryParams.registerRole"
              placeholder="请选择注册角色"
              clearable
              style="width: 180px"
              @keyup.enter="handleQuery"
            >
              <el-option
                v-for="(item, index) in allRole"
                :key="index"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item
            label=""
            prop="createTime"
          >
         
  
            <el-date-picker
              clearable
              v-model="createTime"
              type="datetimerange"
              value-format="YYYY-MM-DD HH:mm:ss"
              start-placeholder="开始时间"
              end-placeholder="结束时间"
              @keyup.enter="handleQuery"
            >
            </el-date-picker>
          </el-form-item> -->
          <!-- <el-form-item>
            <el-button
              type="info"
              icon="Search"
              @click="handleQuery()"
            />
          </el-form-item> -->
        </el-form>
      </div>
  
      <el-table
        v-loading="loading"
        :data="inviteList"
        @selection-change="handleSelectionChange"
      >
        <el-table-column
          label="区县"
          align="center"
          prop="userId"
        />
        <el-table-column
          label="抢单模式"
          align="center"
          prop="orderType"
        >
           <template #default="{row}">
               {{ row.orderType == 1 ? '抢单模式' : row.orderType == 1 ? '自由派单模式' : ''}}
           </template>
        </el-table-column>
        <el-table-column
          label="操作"
          align="center"
          prop="iname"
        />
      </el-table>
  
      <pagination
        v-show="total > 0"
        :total="total"
        v-model:page="queryParams.pageNum"
        v-model:limit="queryParams.pageSize"
        @pagination="getList"
      />
    </div>
  </template>
  
  <script setup name="Invite">
  import {
    listInvite,
    getInvite,
    delInvite,
    addInvite,
    updateInvite,
  } from "@/api/system/invite";
  import {listrulo} from '@/api/danrulo/index'
  
  const { proxy } = getCurrentInstance();
  const router = useRouter();
  
  const inviteList = ref([]);
  const open = ref(false);
  const loading = ref(true);
  const showSearch = ref(true);
  const ids = ref([]);
  const single = ref(true);
  const multiple = ref(true);
  const total = ref(0);
  const title = ref("");
  //根据时间搜索时用
  const createTime = ref([]);
  
  const data = reactive({
    allRole: [
      {
        label: "乘客",
        value: 0,
      },
      {
        label: "司机",
        value: 1,
      },
    ],
    form: {},
    queryParams: {
      pageNum: 1,
      pageSize: 10,
      registerRole: null,
      inviteId: null,
    },
    rules: {},
  });
  
  const { queryParams, form, rules, allRole } = toRefs(data);
  
  /** 查询邀请好友列表 */
  function getList() {
    loading.value = true;
    console.log(queryParams.value,'搜索传递的参数ttttttttttt')
    listrulo(queryParams.value).then((response) => {
      console.log(response,'reponses返回的数据')
      inviteList.value = response.rows;
      total.value = response.total;
      loading.value = false;
    });
  }
  
  // 取消按钮
  function cancel() {
    open.value = false;
    reset();
  }
  
  // 表单重置
  function reset() {
    form.value = {
      inviteUserId: null,
      userId: null,
      registerRole: null,
      inviteId: null,
      inviteRole: null,
    };
    proxy.resetForm("inviteRef");
  }
  
  /** 搜索按钮操作 */
  function handleQuery() {
    queryParams.value.pageNum = 1;
    console.log(createTime.value,'时间搜索时传递的时间参数')
    if (createTime.value && createTime.value.length >= 2) {
      queryParams.value.startSift = createTime.value[0];
      queryParams.value.endSift = createTime.value[1];
    } else {
      queryParams.value.startSift = "";
      queryParams.value.endSift = "";
    }
    getList();
  }
  
  /** 重置按钮操作 */
  function resetQuery() {
    proxy.resetForm("queryRef");
    handleQuery();
  }
  
  // 多选框选中数据
  function handleSelectionChange(selection) {
    ids.value = selection.map((item) => item.inviteUserId);
    single.value = selection.length != 1;
    multiple.value = !selection.length;
  }
  
  /** 新增按钮操作 */
  function handleAdd() {
    // reset();
    // open.value = true;
    // title.value = "添加邀请好友";
    router.push({ path: "/sijiguanli/addrule" });
  }
  
  /** 修改按钮操作 */
  function handleUpdate(row) {
    reset();
    const _inviteUserId = row.inviteUserId || ids.value;
    getInvite(_inviteUserId).then((response) => {
      form.value = response.data;
      open.value = true;
      title.value = "修改邀请好友";
    });
  }
  
  /** 提交按钮 */
  function submitForm() {
    proxy.$refs["inviteRef"].validate((valid) => {
      if (valid) {
        if (form.value.inviteUserId != null) {
          updateInvite(form.value).then((response) => {
            proxy.$modal.msgSuccess("修改成功");
            open.value = false;
            getList();
          });
        } else {
          addInvite(form.value).then((response) => {
            proxy.$modal.msgSuccess("新增成功");
            open.value = false;
            getList();
          });
        }
      }
    });
  }
  
  /** 删除按钮操作 */
  function handleDelete(row) {
    const _inviteUserIds = row.inviteUserId || ids.value;
    proxy.$modal
      .confirm('是否确认删除邀请好友编号为"' + _inviteUserIds + '"的数据项？')
      .then(function () {
        return delInvite(_inviteUserIds);
      })
      .then(() => {
        getList();
        proxy.$modal.msgSuccess("删除成功");
      })
      .catch(() => {});
  }
  
  /** 导出按钮操作 */
  function handleExport() {
    proxy.download(
      "system/invite/export",
      {
        ...queryParams.value,
      },
      `invite_${new Date().getTime()}.xlsx`
    );
  }
  
  getList();
  </script>
  